<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>tabs</title>
		<link rel="stylesheet" href="css/jquery.mobile-1.4.5.css" />
		<script type="text/javascript" src="js/jquery.js"></script>
		<script type="text/javascript" src="js/jquery.mobile-1.4.5.js"></script>
	</head>

	<body>
		<div data-role="page">
			<div data-role="header">
				<h1>header</h1>
			</div>
			<div role="main" class="ui-content">
				<div data-role="tabs" id="tabs">
					<div data-role="navbar">
						<ul>
							<li><a href="#one" data-ajax="false">one</a></li>
							<li><a href="#two" data-ajax="false">two</a></li>
							<li><a href="ajax-content-ignore.html" data-ajax="false">three</a></li>
						</ul>
					</div>
					<div id="one" class="ui-body-d ui-content">
						<h1>First tab contents</h1>
					</div>
					<div id="two">
						<ul data-role="listview" data-inset="true">
							<li><a href="#">Acura</a></li>
							<li><a href="#">Audi</a></li>
							<li><a href="#">BMW</a></li>
							<li><a href="#">Cadillac</a></li>
							<li><a href="#">Ferrari</a></li>
						</ul>
					</div>
				</div>
			</div>
			<div data-role="footer">
				<h1>footer</h1>
			</div>
		</div>
	</body>

</html>